import 'package:flutter/material.dart';

class ScrollListRoute extends StatelessWidget {
  const ScrollListRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: const Text('滚动页面'),
        ),
        body: Center(
          child: Column(
            children: [
              TextButton(
                onPressed: () => {Navigator.pushNamed(context, 'list_widget')},
                child: const Text('跳转listView'),
              ),
              TextButton(
                onPressed: () =>
                    {Navigator.pushNamed(context, 'list_build_widget')},
                child: const Text('list_build'),
              ),
              TextButton(
                onPressed: () =>
                    {Navigator.pushNamed(context, 'list_separated_widget')},
                child: const Text('list_separated'),
              ),
              TextButton(
                onPressed: () =>
                    {Navigator.pushNamed(context, 'list_head_widget')},
                child: const Text('添加固定列表头'),
              ),
              TextButton(
                onPressed: () => {Navigator.pushNamed(context, 'page_widget')},
                child: const Text('PageView与页面缓存'),
              ),
              TextButton(
                onPressed: () => {Navigator.pushNamed(context, 'tab_widget')},
                child: const Text('跳转tabView'),
              ),
            ],
          ),
        ));
  }
}

class ListViewRoute extends StatelessWidget {
  const ListViewRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('listView'),
      ),
      body: ListView(
        //该属性表示是否根据子组件的总长度来设置,默认是false
        shrinkWrap: false,
        padding: const EdgeInsets.all(16),
        children: const [
          Text('I\'m dedicating every day to you'),
          Text('Domestic life was never quite my style'),
          Text('When you smile, you knock me out, I fall apart'),
          Text('And I thought I was so smart'),
        ],
      ),
    );
  }
}

class ListBuildRoute extends StatelessWidget {
  const ListBuildRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('listView'),
      ),
      body: ListView.builder(
          itemCount: 100,
          //固定高度
          itemExtent: 60,
          itemBuilder: (BuildContext context, int index) {
            return ListTile(
              title: Text('$index'),
            );
          }),
    );
  }
}

class ListSeparatedRoute extends StatelessWidget {
  const ListSeparatedRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    Divider divider = const Divider(
      color: Colors.lightBlue,
    );

    Divider greenDivider = const Divider(
      color: Colors.lightGreen,
    );
    return Scaffold(
        appBar: AppBar(
          title: const Text('listView'),
        ),
        body: ListView.separated(
            itemCount: 100,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                title: Text('$index'),
              );
            },
            separatorBuilder: (BuildContext context, int index) {
              return index % 2 == 0 ? divider : greenDivider;
            }));
  }
}

// //无限加载列表
// class InfiniteListView extends StatefulWidget {
//   const InfiniteListView({Key? key}) : super(key: key);

//   @override
//   State<InfiniteListView> createState() => _InfiniteListViewState();
// }

// class _InfiniteListViewState extends State<InfiniteListView> {
//   static const loadingTag = "##loading##"; //表尾标记
//   var _words = <String>[loadingTag];

//   @override
//   Widget build(BuildContext context) {
//     return Scaffold(
//       appBar: AppBar(
//         title: const Text('无限加载列表'),
//       ),
//       body: Text(''),
//     );
//   }
// }

//添加固定列表头
class ListHeadRoute extends StatelessWidget {
  const ListHeadRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('添加固定表头'),
      ),
      body: Column(
        children: [
          const ListTile(
            title: Text('商品列表'),
          ),
          Expanded(child:
              ListView.builder(itemBuilder: (BuildContext context, int index) {
            return ListTile(
              title: Text('$index'),
            );
          }))
        ],
      ),
    );
  }
}

//PageView与页面缓存
class PageRoute extends StatefulWidget {
  const PageRoute({Key? key, required this.title}) : super(key: key);
  final String title;

  @override
  State<PageRoute> createState() => _PageRoutState();
}

class _PageRoutState extends State<PageRoute> {
  @override
  Widget build(BuildContext context) {
    return Center(
      child: Text(widget.title, textScaleFactor: 5),
    );
  }
}

class PageViewRoute extends StatelessWidget {
  const PageViewRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    var childrens = <Widget>[];
    for (var i = 0; i < 6; i++) {
      childrens.add(PageRoute(title: '$i'));
    }

    return Scaffold(
      appBar: AppBar(
        title: const Text('分页'),
      ),
      body: PageView(
        children: childrens,
        //会预缓存左右两个页面，
        allowImplicitScrolling: true,
      ),
    );
  }
}

//TabBarView 的常用写法
class TabViewRoute extends StatelessWidget {
  const TabViewRoute({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    List tabs = ["新闻", "历史", "图片"];
    return DefaultTabController(
        length: tabs.length,
        child: Scaffold(
            appBar: AppBar(
              title: const Text('App Name'),
              bottom: TabBar(
                tabs: tabs.map((e) => Tab(text: e)).toList(),
              ),
            ),
            body: TabBarView(
              //构建
              children: tabs.map((e) {
                return KeepAliveWrapper(
                    keepAlive: true,
                    child: Container(
                      alignment: Alignment.center,
                      child: Text(e, textScaleFactor: 5),
                    ));
              }).toList(),
            )));
  }
}

//缓存框架源码
class KeepAliveWrapper extends StatefulWidget {
  const KeepAliveWrapper({
    Key? key,
    this.keepAlive = true,
    required this.child,
  }) : super(key: key);
  final bool keepAlive;
  final Widget child;

  @override
  _KeepAliveWrapperState createState() => _KeepAliveWrapperState();
}

class _KeepAliveWrapperState extends State<KeepAliveWrapper>
    with AutomaticKeepAliveClientMixin {
  @override
  Widget build(BuildContext context) {
    super.build(context);
    return widget.child;
  }

  @override
  void didUpdateWidget(covariant KeepAliveWrapper oldWidget) {
    if (oldWidget.keepAlive != widget.keepAlive) {
      // keepAlive 状态需要更新，实现在 AutomaticKeepAliveClientMixin 中
      updateKeepAlive();
    }
    super.didUpdateWidget(oldWidget);
  }

  @override
  bool get wantKeepAlive => widget.keepAlive;
}
